<ion-header class="card-background-page">
  <div class="g-top">
      <div class="m-logo">贵州茂兰国家级自然保护区电子办公系统</div>
    </div>
    <div class="zs-header" style="z-index: 1000">
      <ion-segment [(ngModel)]="pet">
        <ion-segment-button value="待办事宜" (click)="setTable('worklist')">
          待办事宜
        </ion-segment-button>
        <ion-segment-button value="已办事宜" (click)="setTable('overworklist')">
          已办事宜
        </ion-segment-button>
        <ion-segment-button value="日程安排" (click)="setTable('gztaskview')">
          日程安排
        </ion-segment-button>
        <ion-segment-button value="收文" (click)="setTable('gzreceiveview')">
          收文
        </ion-segment-button>
      </ion-segment>
    </div>
</ion-header>
<ion-content class="card-background-page">
  
   <!--待办事项-s-->
   <div style="margin-top: 80px;" *ngIf="tableName=='worklist'">
    <ion-refresher (ionRefresh)="worklist.doRefresh($event)">
      <ion-refresher-content pullingIcon="arrow-dropdown"  pullingText="下拉刷新"  refreshingSpinner="circles"  refreshingText="刷新中...">
        </ion-refresher-content>
    </ion-refresher>

    <ion-list *ngFor="let item of worklist.datas" 
    style="padding-left: 1px;right: -7px;width: calc(100% - 15px);
    margin-top:10px; ">
      <button ion-item detail-none class="buttonscss" (click)="toQueryWork(item)">
        <!--<ion-icon item-left color="#444" name="{{item.icon}}"></ion-icon>-->
        <h3>{{item.sbusiness}}</h3>
        <p item-right>{{item.taskdefname}}({{item.actdefname}})</p>
      </button>
    </ion-list>
    
    <!-- 无级滚动效果实现 -->
    <ion-infinite-scroll (ionInfinite)="worklist.doInfinite($event)">
      <ion-infinite-scroll-content></ion-infinite-scroll-content>
    </ion-infinite-scroll>
  </div>
 <!--待办事项-s-->

 <!--已办事项-s-->
 <div style="margin-top: 80px;" *ngIf="tableName=='overworklist'">
  <ion-refresher (ionRefresh)="overworklist.doRefresh($event)">
    <ion-refresher-content pullingIcon="arrow-dropdown"  pullingText="下拉刷新"  refreshingSpinner="circles"  refreshingText="刷新中...">
      </ion-refresher-content>
  </ion-refresher>

  <ion-list *ngFor="let item of overworklist.datas" 
  style="padding-left: 1px;right: -7px;width: calc(100% - 15px);
  margin-top:10px; ">
    <button ion-item detail-none class="buttonscss" (click)="toQueryWork(item)">
      <!--<ion-icon item-left color="#444" name="{{item.icon}}"></ion-icon>-->
      <h3>{{item.sbusiness}}</h3>
      <p item-right>{{item.taskdefname}}({{item.actdefname}})</p>
    </button>
  </ion-list>
  
  <!-- 无级滚动效果实现 -->
  <ion-infinite-scroll (ionInfinite)="overworklist.doInfinite($event)">
    <ion-infinite-scroll-content></ion-infinite-scroll-content>
  </ion-infinite-scroll>
</div>
<!--已办事项-e-->

  <!--日程安排-->
  <div style="margin-top: 80px;" *ngIf="tableName=='gztaskview'">
    <ion-refresher (ionRefresh)="gztaskview.doRefresh($event,editDatas)">
      <ion-refresher-content pullingIcon="arrow-dropdown"  pullingText="下拉刷新"  refreshingSpinner="circles"  refreshingText="刷新中...">
        </ion-refresher-content>
    </ion-refresher>

    <ion-list *ngFor="let item of gztaskview.datas" 
    style="padding-left: 1px;right: -7px;width: calc(100% - 15px);margin-top:10px; ">
      <button ion-item detail-none class="buttonscss" (click)="toggleDetails(item)">
        <ion-icon item-left color="#444" name="{{item.icon}}"></ion-icon>
        <h3>{{item.xmmc}}({{item.ztName}})</h3>
        <p item-right>{{item.cjsj | date:'yyyy-MM-dd'}}</p>
      </button>
      <div *ngIf="item.showDetails" class="divcard" padding #divcard>
        <ion-row>
            <p><span>主题：</span>{{item.zhuti}}</p>
          </ion-row>
        <ion-row>
          <p><span>备注：</span>{{item.sxsm}}</p>
        </ion-row>
        <ion-row>
            <p><span>开始时间：</span>{{item.kssj | date:'yyyy-MM-dd'}}</p>
        </ion-row>
        <ion-row>
            <p><span>结束时间：</span>{{item.jssj | date:'yyyy-MM-dd'}}</p>
        </ion-row>
        <ion-row>
          <ion-col>
            <button ion-button icon-only clear full large (click)="toQuerySchedule(item)">
              <ion-icon name="md-search"></ion-icon>
              查看详情
            </button>
          </ion-col>
        </ion-row>
      </div>
    </ion-list>
    
    <!-- 无级滚动效果实现 -->
    <ion-infinite-scroll (ionInfinite)="gztaskview.doInfinite($event,editDatas)">
      <ion-infinite-scroll-content></ion-infinite-scroll-content>
    </ion-infinite-scroll>
  </div>

  <!--收文-->
  <div style="margin-top: 80px;" *ngIf="tableName=='gzreceiveview'">
    <ion-refresher (ionRefresh)="gzreceiveview.doRefresh($event,editDatas)">
      <ion-refresher-content pullingIcon="arrow-dropdown"  pullingText="下拉刷新"  refreshingSpinner="circles"  refreshingText="刷新中...">
        </ion-refresher-content>
    </ion-refresher>
    <ion-list *ngFor="let item of gzreceiveview.datas" style="padding-left: 1px;right: -7px;width: calc(100% - 15px);margin-top:10px; ">
        <button ion-item detail-none class="buttonscss" (click)="toggleDetails(item)">
          <ion-icon item-left color="#444" name="{{item.icon}}"></ion-icon>
          <h3>{{item.fwzt}}({{item.jjdjName}})</h3>
          <p item-right>{{item.cjsj | date:'yyyy-MM-dd'}}</p>
        </button>
        <div *ngIf="item.showDetails" class="divcard" padding #divcard>
          <ion-row>
            <p><span>来文摘要：</span>{{item.fwsm}}</p>
          </ion-row>
          <ion-row>
              <p><span>创建人：</span>{{item.cjrmc}}</p>
          </ion-row>
          <ion-row>
              <p><span>部门名称：</span>{{item.bmmcName}}</p>
          </ion-row>
          <ion-row>
            <ion-col>
              <button ion-button icon-only clear full large (click)="toQueryReceive(item)">
                <ion-icon name="md-search"></ion-icon>
                查看详情
              </button>
            </ion-col>
          </ion-row>
        </div>
      </ion-list>

    <!-- 无级滚动效果实现 -->
    <ion-infinite-scroll (ionInfinite)="gzreceiveview.doInfinite($event,editDatas)">
      <ion-infinite-scroll-content></ion-infinite-scroll-content>
    </ion-infinite-scroll>
  </div>
</ion-content>
